﻿@model NCLCustomerManagement.UI.Models.Customer.CustomerModel
@{
    
    var currentUser = Session[NCLCustomerManagement.Common.Constant.Constant.CURRENT_USER]
                       as NCLCustomerManagement.UI.Models.User.AuthenticatedUser;
    var username = currentUser.Username;
    var isAdmin = currentUser.IsAdmin;                       
}
<div id="msgAddEdit" class="alert alert-success" style="display: none;">

    <div class="msg-content">Đã thêm khách hàng</div>

</div>

<div class="row">
    <div class="col-xs-6">
        <div>
            <h3 class="section-title">Thông tin cá nhân</h3>

            <div class="form-group">
                @Html.LabelFor(model => model.CustomerName)
                @Html.HiddenFor(model => model.Id)
                @Html.TextBoxFor(model => model.CustomerName, new { @class = "form-control input-sm", placeholder = "Nhập họ tên" })
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.Notes)
                @Html.TextAreaFor(model => model.Notes, new { @class = "form-control input-sm", placeholder = "Ghi chú", rows = "5" })
            </div>
        </div>

    </div>
    <div class="col-xs-6">
        <div>
            <h3 class="section-title">Liên lạc</h3>
            <div class="form-group">
                @Html.LabelFor(model => model.Phone)
                @Html.TextBoxFor(model => model.Phone, new { @class = "form-control input-sm", placeholder = "Nhập số điện thoại" })
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.Address)
                @Html.TextBoxFor(model => model.Address, new { @class = "form-control input-sm", placeholder = "Nhập địa chỉ khách hàng" })
            </div>
            <div class="form-group">
                @Html.LabelFor(model => model.CustomerRegion)
                @Html.DropDownList("CustomerRegion2", ViewBag.RegionList as IEnumerable<SelectListItem>, new { @class = "form-control input-sm", placeholder = "" })
            </div>
        </div>
    </div>
</div>
<div style="display:none;">

    <h3 class="section-title">Sản phẩm</h3>
    <div class="row">
        <div class="col-xs-10 form-inline">
            <div class="form-group">
                @Html.TextBox("ProductCategorySearch", "", new { @class = "form-control input-sm", placeholder = "Tìm sản phẩm" })
            </div>
            <div class="form-group">
                <div class="btn-toolbar">
                    <button id="btnSearchCate" type="button" class="btn btn-primary btn-sm" onclick="searchCategory();"><span class="glyphicon glyphicon-search" title="Tìm"></span></button>
                </div>
            </div>
        </div>


    </div>
    <div class="row">
        <div class="col-xs-5">
            <div class="form-group">
                <strong>Sản phẩm hiện có</strong>
                <div id="foundCategoriesContainer">
                </div>
            </div>
        </div>
        <div class="col-xs-2">
            <div role="form" style="text-align: center; position: relative;">
                <div class="form-group" style="position: absolute; top: 70px; left: 33px;">
                    <p>
                        <button id="btnAddCate" type="button" class="btn btn-primary">
                            <span class="glyphicon glyphicon-arrow-right"></span>
                        </button>
                    </p>
                    <p>
                        <button id="btnRemoveCate" type="button" class="btn btn-primary">
                            <span class="glyphicon glyphicon-arrow-left"></span>
                        </button>
                    </p>
                </div>
            </div>
        </div>
        <div class="col-xs-5">
            <div class="form-group">
                <strong>Khách hàng đã mua</strong>
                @if (Model != null)
                {
                    @Html.ListBox("BoughtCates", new SelectList(Model.Products, "Id", "ProductCategoryName"), new { @class = "form-control input-sm", style = "height:170px;" })
                }
                else
                {
                    <select class="form-control input-sm" id="BoughtCates" multiple="multiple" name="BoughtCates" style="height: 170px;"></select>
                }

            </div>
        </div>
    </div>
</div>
@*<div class="btn-toolbar">
    <div class="bt-n-group" style="float: right;">
        <button id="btnSave" class="btn btn-primary" onclick="save();"><span class="glyphicon glyphicon-save" title="Lưu">Lưu</span></button>
        <button id="btnCancel" class="btn btn-default" onclick="cancel();"><span class="glyphicon glyphicon-log-out" title="Hủy">Hủy</span></button>
    </div>
</div>*@
<script>
    function searchCategory() {
        var searchName = $("#ProductCategorySearch").val();
        $.ajax({
            url: '/Home/SearchCategory/',
            data: { name: searchName },
            contentType: 'text/html',
            dataType: "html",
            type: "get",
            success: function (data) {
                $("#foundCategoriesContainer").html(data);

            },
            error: function (data) {
                alert("Yêu cầu đăng nhập lại");

            }
        });
    }

    function getSelectedItems(list) {
        return $(list).find("option:selected");
    }

    function containItem(list, value) {
        var item = $(list).find('option[value=' + value + ']');
        return item.length > 0;
    }

    function getCustomerModel() {
        return {
            Id: $("#Id").val(),
            CustomerName: $("#CustomerName").val(),
            CustomerRegion: $("#CustomerRegion2 option:selected").val(),
            Phone: $("#Phone").val(),
            Address: $("#Address").val(),
            Notes: $("#Notes").val(),
            Products: function () {
                var products = [];
                $("#BoughtCates option").each(function () {
                    products.push({
                        Id: $(this).val(),
                        ProductCategoryName: $(this).text()
                    });
                });
                return products;
            }()
        };
    }

    function submitNewOrEdit(model, isNew, callback) {
        d = JSON.stringify(model);

        $.ajax({
            url: isNew ? '/Customer/SubmitNew/' : '/Customer/SubmitEdit/',
            data: { customer: d },
            contentType: 'application/json',
            dataType: "json",
            type: "get",
            success: function (data) {
                callback(data);
            },
            error: function (data) {
                //alert("Lỗi lưu");
            }
        });
    }

    function validate(model, callback) {
        var err = [];
        if (model.CustomerName == '') {
            err.push("Bạn chưa nhập họ tên khách hàng");
        }
        if (model.Phone == '') {
            err.push("Bạn chưa nhập số điện thoại khách hàng");
        }
        if (model.Address == '') {
            err.push("Bạn chưa nhập địa chỉ khách hàng");
        }
        checkPhoneExist(model, function (data) {
            if (data.Exist) {
                err.push("Đã có khách hàng với số điện thoại này");
            }

            if (err.length == 0)
                callback();
            else {
                var errMessage = err.join("<br/>");
                showMessage("#msgAddEdit", errMessage, true);
            }
        });



        function checkPhoneExist(model, callback) {
            d = JSON.stringify(model);
            $.ajax({
                url: '/Customer/CheckPhoneExist/',
                data: { customer: d },
                contentType: 'application/json',
                dataType: "json",
                type: "get",
                asyn: false,
                success: function (data) {
                    callback(data);
                },
                error: function (data) {
                    //alert("Lỗi lưu");
                }
            });
        }
    }

    function cancel() {
        $('#editWindow').modal('hide');
    }

    $(document).ready(function () {
        searchCategory();

        $("#btnAddCate").click(function () {
            var items = getSelectedItems($("#FoundCategories"));
            $(items).each(function () {
                if (!containItem($("#BoughtCates"), $(this).val())) {
                    $("#BoughtCates").append($(this));
                }
            });
        });

        
    });
</script>





